@import "../../styles/default";

.erayt-router-tab{
  .erayt-router-tab-header {
    display: flex;
    align-items: center;

    justify-content: center;
    font-size:pxToRem(14);
    font-family:PingFang-SC-Medium;
    font-weight:500;
    text-align: center;
    border:1px solid rgba(219, 216, 216, 1);

    .tab-header-item{
      flex:1;
      position: relative;
      padding:size(11) 0;
      .tab-header-split{
        position:absolute;
        bottom: 0;
        display: inline-block;
        border-radius:3px;
        width: pxToRem(20);
        height: size(3);
        left:0;
        right:0;
        margin: auto;
        background: #5326FF;
      }
      &.erayt-item-active{
        color: #5326FF;
      }
      &.erayt-item-normal{
        color: #2E2E2E;
      }
    }
    .theme-change{
      width: size(34);
      line-height: size(34);
      position:relative;
    }
    .theme-change::before{
      width:1px;
      height:100%;
      transform: scale(0.5, 1);
      background: rgba(219, 216, 216, 1);
      content: ' ';
      position: absolute;
      left:0;
      display: inline-block;
    }
  }
  .erayt-router-tab-content{
    .erayt-router-content{
      display: none;
      &.active{
        display: block;
      }
    }
  }
}
